<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>电子时钟</title>

    <script type="text/javascript">
        let loaded = function(){
            let timeArea = document.querySelector( '.time' ) ; // 选择并返回 .time 元素
            const today = new Date();
            let show = function(){
                today.setTime( Date.now() );
                let year = today.getFullYear();
                let month = today.getMonth() + 1 ;
                let date = today.getDate();
                let hours = today.getHours();
                hours = String(hours).padStart( 2 , '0' );
                let minutes = today.getMinutes();
                minutes = String(minutes).padStart( 2 , '0' );
                let seconds = today.getSeconds();
                seconds = String(seconds).padStart( 2 , '0' );
                let content = `${year}年${month}月${date}日 ${hours}:${minutes}:${seconds}`
                timeArea.innerHTML = content ;
                setTimeout( show , 1000 );
            }
            show();
        }
        // 为 window 实例 绑定 load 事件的 监听器
        window.addEventListener( 'load' , loaded , false );
    </script>

</head>
<body>

    <div class="time"></div>
    
</body>
</html>